<template>
	<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000">
		<swiper-item v-for="(item,index) in metadata.bannerList" :key="index">
			<view @tap="handleClick(item)" class="swiper-item">
				<image class="swiper-img" :src="item.img" mode=""></image>
			</view>
		</swiper-item>
	</swiper>
</template>

<script>

	export default {
		props: {metadata: Object},
		methods: {
			handleClick(obj) {
				if(obj.type === 1) {
					uni.navigateTo({
						url: obj.url
					})
					return
				}
				if(obj.type === 2) {
					location.href = obj.url
					return
				}
				if(obj.type === 3) {
					uni.switchTab({
						url: obj.url
					})
				}
			}
		}
	}

</script>

<!-- scoped 表示是局部的 css -->
<style scoped>
	swiper {
		margin: 20rpx auto;
		width: 96%;
		height: 300rpx;
		overflow: hidden;
		border-radius: 15rpx;
	}
	.swiper-img {
		width: 100%;
		height: 300rpx;
	}
</style>
